<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>修改密码</title>
    <link rel="stylesheet" href="../layui/css/layui.css">
    <script src="../layui/layui.js"></script>
    <link rel="stylesheet" href="../css/basic.css">
</head>

<body>
    <!-- fm-basic负责使表格居中 -->
    <form class="layui-form fm-basic" action="">
        <div class="layui-form-item">
            <label class="layui-form-label">旧密码</label>
            <div class="layui-input-block">
                <input type="password" name="password1" required lay-verify="pass" placeholder="请输入密码" autocomplete="off" class="layui-input" maxlength="6">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">新密码</label>
            <div class="layui-input-block">
                <input type="password" id="L_pass" name="password2" required lay-verify="pass" placeholder="请输入密码" autocomplete="off" class="layui-input" maxlength="6">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">确认新密码</label>
            <div class="layui-input-block">
                <input type="password" id="N_pass" name="password3" required lay-verify="repass|pass" placeholder="请输入密码" autocomplete="off" class="layui-input" maxlength="6">
            </div>
        </div>
        <!-- btn-center 负责让包含了提交与重置按钮居中 -->
        <div class="layui-form-item">
            <div class="layui-input-block btn-center">
                <button class="layui-btn" lay-submit lay-filter="pwd">提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>
</body>

<script>
    //监听表单
layui.use(['form','jquery'], function () {
    var form = layui.form;
    var $ = layui.jquery;
    form.verify({
        //为账号定义的验证添加规则
        repass: function (value) {
            var repassvalue = $('#L_pass').val();
            if (value != repassvalue) {
                return '两次输入的密码不一致!';
            }
        },
        pass: [/(.+){6,12}$/, '密码必须6到12位']

    })

    //监听提交
    form.on('submit(pwd)', function (data) {
        layer.msg("提交成功",{
            icon:6
        })
        return false;
    })
});
</script>

</html>